<template>
  <div style="padding:20px">
    <!-- <p>做这张票样我仅用了几分钟时间，仍得益于Lodop提供的辅助<a style="color:red" @click="design">打印设计</a>功能。</p> -->

    <p>如果你同一个页面程序要应付不同的打印机，完全可以将<span style="color:blue;cursor:pointer">打印维护</span></p>
    <p>功能授权给操作者，打印维护中按钮“应用”结果保存在操作者自己的电脑上，保存时与</p>
    <p>“打印任务名”相对应，这样任何打印机都可以适应同一个页面程序了！</p>
    <p>●在“打印维护”或“打印设计”中按住SHIFT用鼠标可多选目标，可调整纸张及明细项的位置、</p>
    <p>大小、字体、颜色、左右靠齐、粗斜体、下划线以及各式对齐等，调乱了可复原，也可</p>
    <p>恢复缺省布局风格。在打印设计时， 按住CTRL再拖拽选中的对象，可实现快速复制。</p>

    <!-- <p>下面是互联网上的一个图片，进入以它为背景图的<a style="color:red" @click="myPrintSetup">打印维护</a>看看。</p> -->

    <p>默认情况下背景图是不打印的，可以用BKIMG_PRINT让<a style="color:blue;cursor:pointer" @click="myPreview">打印或预览</a>包含背景图。</p>

    <!-- <el-button type="primary" @click="design">打印设计</el-button> -->
    <el-button type="success" @click="myPrintSetup">打印维护</el-button>
    <el-button type="success" @click="myPreview">打印或预览</el-button>

  </div>

</template>

<script>
import { getLodop } from '@/utils/lodop/LodopFuncs.js';
import { getQueryBodyByProduce } from '@/api/dynamicInterface/index';
import { digitUppercase } from '@/utils/utils';

export default {
  data() {
    return {
      loop: '',
      dataList: []
    };
  },
  mounted() {
    // this.createPage();
  },
  methods: {
    async design() {
      await this.createPage();
      this.loop.PRINT_DESIGN();
    },

    async myPrintSetup() {
      await this.createPage();
      // this.loop.ADD_PRINT_SETUP_BKIMG("<img border='0' src='http://www.lodop.net/demolist/PrintSample9.jpg'>");
      this.loop.PRINT_SETUP();
    },
    async myPreview() {
      await this.createPage();
      // this.loop.ADD_PRINT_SETUP_BKIMG("<img border='0' src='http://www.lodop.net/demolist/PrintSample9.jpg'>");
      this.loop.SET_SHOW_MODE('BKIMG_PRINT', 1);
      this.loop.PREVIEW();
    },
    createPage() {
      this.loop = getLodop();
      getQueryBodyByProduce({
        'tableId': 835,
        'pageIndex': 0,
        'pageSize': 1000,
        'pageType': 1,
        'filterList': [
          {
            'col': 'FORMGUID', // 字段
            'value': this.$route.query.formList, // 勾选的字段值
            'symbol': 'in'
          }
        ],
        'cprogramname': ''
      }).then(res => {
        if (res.success) {
          res.data.map(o => {
            o.DX = digitUppercase(Number(o.PAYMONEY));
          });
          this.dataList = res.data;
        } else {
          this.dataList = [];
        }
      });

      this.dataList.map(o => {
        this.loop.PRINT_INITA(10, 10, 762, 533, '预算拨款凭证');
        this.loop.SET_PRINT_PAGESIZE(1, 2090, 1130, '');
        this.loop.ADD_PRINT_SETUP_BKIMG('http://122.224.35.130:8081/img/bg.png');
        // 默认的字体大小
        this.loop.SET_PRINT_STYLEA(0, 'FontSize', 9);
        // this.loop.ADD_PRINT_TEXT(71, 131, 194, 25, o.a);
        // if (o.a.length > 20) {
        //   this.loop.SET_PRINT_STYLEA(0, 'FontSize', 8);
        // }
        // this.loop.ADD_PRINT_TEXT(71, 427, 202, 25, o.b);
        // if (o.b.length > 20) {
        //   this.loop.SET_PRINT_STYLEA(0, 'FontSize', 8);
        // }

        this.loop.ADD_PRINT_TEXT(71, 131, 194, 25, o.FKDX);
        if (o.FKDX.length > 20) {
          this.loop.SET_PRINT_STYLEA(0, 'FontSize', 8);
        }
        this.loop.ADD_PRINT_TEXT(71, 427, 202, 25, o.SKDX);
        if (o.SKDX.length > 20) {
          this.loop.SET_PRINT_STYLEA(0, 'FontSize', 8);
        }
        this.loop.ADD_PRINT_TEXT(97, 129, 196, 25, o.FKZH);
        this.loop.ADD_PRINT_TEXT(97, 424, 204, 22, o.SKZH);
        this.loop.ADD_PRINT_TEXT(125, 131, 102, 23, o.FKYH);
        if (o.FKYH.length > 20) {
          this.loop.SET_PRINT_STYLEA(0, 'FontSize', 7);
        }
        this.loop.ADD_PRINT_TEXT(125, 275, 50, 25, '');
        this.loop.ADD_PRINT_TEXT(122, 425, 105, 25, o.SKYH);
        if (o.SKYH.length > 20) {
          this.loop.SET_PRINT_STYLEA(0, 'FontSize', 7);
        }
        this.loop.ADD_PRINT_TEXT(125, 576, 45, 30, '');
        this.loop.ADD_PRINT_TEXT(155, 129, 262, 57, o.DX);
        this.loop.ADD_PRINT_TEXT(185, 405, 217, 25, o.PAYMONEY);
        this.loop.ADD_PRINT_TEXT(43, 189, 74, 23, o.PAYDATE.split('-')[0]);
        this.loop.ADD_PRINT_TEXT(43, 284, 31, 25, o.PAYDATE.split('-')[1]);
        this.loop.ADD_PRINT_TEXT(43, 327, 30, 25, o.PAYDATE.split('-')[2]);
        this.loop.ADD_PRINT_TEXT(43, 537, 51, 25, o.LSH);
      });
    }
  }

};
</script>
